<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="" method="post" enctype=""></form>
    <input type="file" name="" id="file">
    <script>
        var file = document.querySelector('#file')
        console.dir(file)
        file.onchange = function(){
            // console.dir(this)
            // // this.files[0]//二进制数据得到
            // 两种表单 
            // 普通表单 全部是纯文本 application/x-www-form-urlencoded 打包在一起发快递  a=1&b=2 
            // 非普通表单 带有文件上传类型 multipart/form-data FormData 上传二进制数据
            console.log(this.files[0] instanceof Blob)
        }
    </script>
</body>
</html>

<!-- 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="" id="myform">
        <input type="text" name="username" id="">
        <input type="text" name="password" id="">
        <input type="submit" value="提交">
    </form>
    <script>
        var myform = document.querySelector('#myform')
        myform.onsubmit = function(e){
            e.preventDefault();
            //FormData来把表单数据全部一次性获取
            var form = document.querySelector('#myform');
            //迭代器
            var fd = new FormData(form);
            fd.forEach(function(v,k){
                console.log(v,k);
            })
        }
    </script>
</body>
</html> -->